<div class="w-full mx-auto">
    <div class="px-4 sm:px-6 py-4 border-b border-gray-200">
        <h3 class="text-lg font-semibold text-gray-900">修改密码</h3>
    </div>
    <form id="changePasswordForm" action="/user/security" method="POST">
        <div class="px-4 sm:px-6 py-4 sm:py-6 space-y-4 sm:space-y-6">
            <%- include('../components/alert', { type: 'error', message: customError }) %>
            <%- include('../components/alert', { type: 'success', message: customSuccess }) %>
            <input type="hidden" name="_method" value="PUT">
            <div>
                <label class="block text-sm font-semibold text-gray-900 mb-2">
                    旧密码 <span class="text-red-500">*</span>
                </label>
                <%- include('../components/input', { name: 'old_password', type: 'password', placeholder: '请输入旧密码', required: true, minWidth: 'min-w-80 sm:min-w-[500px]' }) %>
            </div>

            <div>
                <label class="block text-sm font-semibold text-gray-900 mb-2">
                    新密码 <span class="text-red-500">*</span>
                </label>
                <%- include('../components/input', { name: 'new_password', type: 'password', placeholder: '请输入新密码', required: true, minWidth: 'min-w-80 sm:min-w-[500px]' }) %>
            </div>

            <div>
                <label class="block text-sm font-semibold text-gray-900 mb-2">
                    确认密码 <span class="text-red-500">*</span>
                </label>
                <%- include('../components/input', { name: 'confirm_password', type: 'password', placeholder: '请再次输入新密码', required: true, minWidth: 'min-w-80 sm:min-w-[500px]' }) %>
            </div>
        </div>

        <div class="px-4 sm:px-6 py-3 sm:py-4 border-t border-gray-200 flex flex-col sm:flex-row justify-end space-y-2 sm:space-y-0 sm:space-x-3">
            <%- include('../components/button', { type: 'submit', text: '修改密码', variant: 'primary' }) %>
            <%- include('../components/button', { text: '取消', onclick: 'closeModal("changePasswordModal")', variant: 'outline' }) %>
        </div>
    </form>
</div>